$(function(){
	var input = $(".search_input");
	input.val("");
	var search_autocomplete = $("<div class='search_autocomplete'></div>");
	$("body").append(search_autocomplete);
	input.unbind("input propertychange").bind("input propertychange", function(){
		var search_autocomplete = $(".search_autocomplete");
		var keyword = input.val();
		if (!keyword){
			search_autocomplete.hide();
			return;
		}
		$.post("/searchCourse", {keyword:keyword}, function(courses){
			$.post("/searchUser", {keyword:keyword}, function(users){
				search_autocomplete.empty();
				var search_course = $("<div class='search_course'></div>");
				for (var i in courses["result"]){
					var course = courses["result"][i];
					
					course.isFreeName = course.isFree=='Y' ? "免费" : "收费";
					if (course.courseType=="VOD") course.courseTypeName = "点播";
					if (course.courseType=="LIVE") course.courseTypeName = "直播";
					if (course.courseType=="FACE") course.courseTypeName = "面授";
					
					var div = $("<a courseid='"+course.courseId+"' href='/course/"+course.courseId+"' target='_blank'></a>");
					div.append("<span class='course_type "+course.courseType+"'>［"+course.courseTypeName+"］</span>");
					div.append("<span class='title'>"+course.title+"</span>");
					div.append("<span class='is_free "+course.isFree+"'>"+course.isFreeName+"</span>");
					search_course.append(div);
				}
				var search_user = $("<div class='search_user'>");
				for (var i in users["result"]){
					var user = users["result"][i];
					user.isInstructorName = user.isInstructor=='Y' ? "讲师" : "学员";
					
					var div = $("<a userid='"+user.userId+"' href='/user/"+user.userId+"' target='_blank'></a>");
					div.append("<span class='avatar'><img src='"+(user.avatar?user.avatar:"/resources/wangxiaoyun/img/default/avatar.png")+"' align='absmiddle'></span>");
					div.append("<span class='nickname'>"+user.nickname+"</span>");
					div.append("<span class='is_instructor "+user.isInstructor+"'>"+user.isInstructorName+"</span>");
					search_user.append(div);
				}
				if(0==courses["result"].length && 0==users["result"].length){
					var search_nofound = "<div class='search_none' style='color:#81828c;text-align:center'>没有搜索结果</div>";
					search_autocomplete.append(search_nofound);
				}
				
				search_autocomplete.append(search_course);
				search_autocomplete.append(search_user);
				search_autocomplete.show().addClass("search_focus");

				var conHeight = $(".search_course").outerHeight() + $(".search_user").outerHeight() + 50; 
				if(0==courses["result"].length && 0==users["result"].length){
					conHeight +=  $(".search_none").outerHeight();
				}
				$(".search_autocomplete").css({"height":conHeight});
			});
		});
	});
	input.unbind("focus").bind("focus", function(){
		$(".search_autocomplete").css({
			"top":input.offset().top+input.outerHeight()+2,
			"left":input.offset().left-$(".xin-search").width()
		});
		var keyword = input.val();
		if (!keyword){return;}
		if(0 < keyword.length){
			$(".search_autocomplete").addClass("search_focus");
		}
		$(".search_autocomplete").show();
	});
	$(document).unbind("click.autocomplete").bind("click.autocomplete", function(event){
		var target = $(event.target || event.srcElement);
		if (target.parents(".search_autocomplete:first").length || target.hasClass("search_autocomplete") || target.hasClass("search_input")){
			return ;
		}
		$(".search_autocomplete").hide().removeClass("search_focus");
	});
	$(window).resize(function(){
		$(".search_autocomplete").css({
			"top":input.offset().top+input.outerHeight()+2,
			"left":input.offset().left-$(".xin-search").width()
		});
	});
	
	//解决IE8,9 对bootstrap placeholder 不兼容问题
	supportPlaceholder='placeholder'in document.createElement('input'),
	placeholder=function(input){
		var text = input.attr('placeholder'),defaultValue = input.defaultValue;
	    if(!defaultValue){
	    	input.val(text).addClass("phcolor");
	    }
	    input.focus(function(){
	      if(input.val() == text){
	    	  $(this).val("");
	      }
	    });
	    input.blur(function(){
	      if(input.val() == ""){
	    	  $(this).val(text).addClass("phcolor");
	      }
	    });
	    //输入的字符不为灰色
	    input.keydown(function(){
	      $(this).removeClass("phcolor");
	    });
	};
	//当浏览器不支持placeholder属性时，调用placeholder函数
	if(!supportPlaceholder){
	  $('input').each(function(){
	    text = $(this).attr("placeholder");
	    if($(this).attr("type") == "text"){
	    	placeholder($(this));
	    }
	  });
	}
	
	//学习记录
	$("#courseRecord").click(function() {
		if($(this).hasClass("open")){
			return;
		}
		$.post("/searchRecords", "", function(data){
			$("#courseRecord ul").remove();
			if(data.status == "success"){
				var record_panel = $("#courseRecord");
				var div = $("<ul class='dropdown-menu'></ul'>");
				for (var i in data["result"]){
					var courseRecord = data["result"][i];
					var title = courseRecord.courseTitle;
					var progress = parseInt(100 * courseRecord.courseCompletedLectures / courseRecord.courseTotalLectures);
					div.append("<li style='line-height:28px;margin:0px 15px 0px 0px;'>" +
							"<a style='display:inline-block;width:220px;' href='/course/"+courseRecord.courseId+"'>" +
								"<span style='vertical-align:bottom;display:inline-block;width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;' title='"+title+"'>"+title+"</span>" +
								"<span style='display:inline-block;margin:0px 10px 0px 0px;color:#777;'>观看至"+progress+"%</span>" +
							"</a>" +
							"<span class='pull-right'><a class='btn btn-xs btn-info' href='/secure/course/"+courseRecord.courseId+"/learn#lesson/"+courseRecord.curriculumId+"'>继续学习</a></span>" +
							"</li>");
				}
				if(0 == data["result"].length){
					div.addClass("text-center");
					div.append("<span style='color:#777'>暂无学习记录</span>");
				}
				div.append("<hr style='margin: 5px 0px;'><a class='pull-right' style='margin:0px 15px;' href='/secure/my/course/learning'>我的课程</a>");
				record_panel.append(div);
			}

			$("#courseRecord li").css("width","290px");
		});
	});
	
});